<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<div
	style="width: 1000px; height: 100%; padding: 10px; margin: 20px auto;">
	<div class="easyui-panel" title="统计数据报表样例">
		<div id="report_Demo"
			style="height:600px; width: 950px;"></div>
	</div>
</div>
<script src="${pageContext.request.contextPath}/js/echarts.js"
	type="text/javascript">
	
</script>

<script>
	var myec;
	function DrawStdLine(id) {
		myChart = echarts.init(document.getElementById(id));
		option = {
			title : {
				text : '', // 主标题文本
				subtext : '',
				x : 'center'
			// 副标题文本
			},
			grid : {
				y2 : 100
			},
			tooltip : {
				trigger : 'axis', // tooltip触发方式:axis以X轴线触发,item以每一个数据项触发
				axisPointer : { // 坐标轴指示器，坐标轴触发有效
					type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'
				}
			},
			legend : {
				data : [ '利润', '支出', '收入' ]
			},
			grid : {
				left : '3%',
				right : '4%',
				bottom : '3%',
				containLabel : true
			},
			toolbox : { // 工具箱，每个图表最多仅有一个工具箱
				show : true, // 是否显示工具栏
				orient : 'horizontal', // 布局方式，默认为水平布局，可选为：
				// 'horizontal' ¦ 'vertical'
				x : 'right', // 水平安放位置，默认为全图右对齐，可选为：
				// 'center' ¦ 'left' ¦ 'right'
				// ¦ {number}（x坐标，单位px）
				y : 'top', // 垂直安放位置，默认为全图顶端，可选为：
				// 'top' ¦ 'bottom' ¦ 'center'
				// ¦ {number}（y坐标，单位px）
				borderWidth : 0, // 工具箱边框线宽，单位px，默认为0（无边框）
				padding : 30,
				feature : {
					// 辅助线标志
					mark : {
						show : false
					},
					dataView : {
						show : true,
						readOnly : false
					}, //数据预览
					magicType : {
						show : true,
						type : [ 'line', 'bar' ]
					},
					restore : {
						show : true
					}, //复原
					//是否启用拖拽重计算特性，默认关闭(即值为false)
					calculable : true,
					saveAsImage : {
						show : false
					}
				// 是否保存图片
				}
			},
			xAxis : [ {
				type : 'value'
			} ],
			yAxis : [ {
				type : 'category',
				axisTick : {
					show : false
				},
				data : [ '周一', '周二', '周三', '周四', '周五', '周六', '周日' ]
			} ],
			series : [ {
				name : '利润',
				type : 'bar',
				label : {
					normal : {
						show : true,
						position : 'inside'
					}
				},
				data : [ 200, 170, 240, 244, 200, 220, 210 ]
			}, {
				name : '收入',
				type : 'bar',
				stack : '总量',
				label : {
					normal : {
						show : true
					}
				},
				data : [ 320, 302, 341, 374, 390, 450, 420 ]
			}, {
				name : '支出',
				type : 'bar',
				stack : '总量',
				label : {
					normal : {
						show : true,
						position : 'left'
					}
				},
				data : [ -120, -132, -101, -134, -190, -230, -210 ]
			} ]
		};
		myChart.setOption(option);
	};
	$(function() {
		DrawStdLine('report_Demo');
	});
</script>